import { useState, useEffect } from 'react'

export default function App() {
  const [count, setCount] = useState(0)
  const [age, setAge] = useState(8)

  const handleClick = () => {
    setCount(count + 1)
  }

  // !解决，表示只有依赖项的状态发生变化了才执行回调，useEffect 回调触发时机：一上来会执行、count 状态变化会执行
  useEffect(() => {
    console.log('~~')
    document.title = count
  }, [count]) // [依赖项]
  return (
    <div>
      <h3>count: {count}</h3>
      <h3>age: {age}</h3>
      <button onClick={handleClick}>count+1</button>
      <button onClick={() => setAge(age + 1)}>age+1</button>
    </div>
  )
}
